import React from 'react';
import { Button, Drawer, Timeline } from 'antd';
import Icon from '@ant-design/icons';
import './AbsentDrawer.css';

function AbsentDrawer(props) {
    const { title = '查看请假申请', onClose, open, data } = props
    return (
        <>
            <Drawer title={title} placement="right" onClose={onClose} closable={false} open={open} width={600} className="drawer">
                <h3>{data.name}/{data.className}</h3>
                <p>{data.Publisher}：{new Date(data.createTime).toLocaleString()}</p>
                <p>请假类型：{data.type}</p>
                <p>请假时间：{data.time}</p>
                <p>请假事由：{data.reason}</p>
                <h3>审批流程</h3>
                <Timeline>
                    {/* dot={<img src='/u2340.png' className='timeIcon'></img>} */}
                    <Timeline.Item className="timeline">
                        <span className='timeline content'>
                            班主任：杨老师
                        </span>
                        <span className='timeline ok'>已同意</span>
                    </Timeline.Item>
                    {/* dot={<img src='/u2340.png' className='timeIcon'></img>} */}
                    <Timeline.Item className="timeline">
                        <span className='timeline content'>
                            家长：张亮
                        </span>
                        <span className='timeline waiting'>待确认</span>
                    </Timeline.Item>
                </Timeline>
                <div>
                    {props.children}
                </div>
            </Drawer>
        </>
    );
}

export default AbsentDrawer;